<!DOCTYPE html>
<html>
    
    <head>
        <meta charset="UTF-8">
            <title>测试导航栏</title>
            <link rel="stylesheet" href="css/bootstrap.css" />
            <link rel="stylesheet" href="css/statistics.css">
                <!--<meta name="viewport" content="width=device-width, initial-scale=1">-->
                <script src="js/jquery-3.1.1.min.js"></script>
                <script src="js/bootstrap.min.js"></script>
                <script src="js/highcharts.js"></script>
                <script src="js/highcharts-more.js"></script>
                <script src="js/data.js"></script>
                
                <script type="text/javascript">
                    function showMessage(content) {
                        var jsonString = '{"name":"xubohao","age":"24","sex":"man"}';
                        var obj = JSON.parse(jsonString);
                        document.getElementById("myFirstJavaToJs").innerHTML = content + obj.name;
                        
                    }
                
                function requestData() {
                    document.location = "js://zqx?type=tonhqi";
                }
                
                
                    </script>
                </head>
    
    <!--	<body onload="javascript:contact.showM()">-->
    
    <body onload="requestData()">
        <div>
            <nav class="navbar navbar-default" role="navigation">
                <div class="container-fluid">
                    <!-- Brand and toggle get grouped for better mobile display -->
                    <div class="navbar-header">
                        <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
                            <span class="sr-only">Toggle navigation</span>
                            <span class="icon-bar"></span>
                            <span class="icon-bar"></span>
                            <span class="icon-bar"></span>
                        </button>
                        <a class="navbar-brand" href="#">报表</a>
                    </div>
                    
                    <!-- Collect the nav links, forms, and other content for toggling -->
                    <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
                        <ul class="nav navbar-nav">
                            <li>
                                <a href="#">选项1</a>
                            </li>
                            <li>
                                <a href="#">选项2</a>
                            </li>
                            <li class="dropdown">
                                <a href="#" class="dropdown-toggle" data-toggle="dropdown">下拉选项1 <span class="caret"></span></a>
                                <ul class="dropdown-menu" role="menu">
                                    <li>
                                        <a href="#">操作1</a>
                                    </li>
                                    <li>
                                        <a href="#">另一个操作</a>
                                    </li>
                                    <li>
                                        <a href="#">其他的事务</a>
                                    </li>
                                    <li class="divider"></li>
                                    <li>
                                        <a href="#">分开的选项</a>
                                    </li>
                                    <li class="divider"></li>
                                    <li>
                                        <a href="#">另一个分开的选项</a>
                                    </li>
                                </ul>
                            </li>
                        </ul>
                        <form class="navbar-form navbar-left" role="search">
                            <div class="form-group">
                                <input type="text" class="form-control" placeholder="搜索">
                                    </div>
                            <button type="submit" class="btn btn-default">提交</button>
                        </form>
                        <ul class="nav navbar-nav navbar-right">
                            <li>
                                <a href="#">Link</a>
                            </li>
                            <li class="dropdown">
                                <a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <span class="caret"></span></a>
                                <ul class="dropdown-menu" role="menu">
                                    <li>
                                        <a href="#">Action</a>
                                    </li>
                                    <li>
                                        <a href="#">Another action</a>
                                    </li>
                                    <li>
                                        <a href="#">Something else here</a>
                                    </li>
                                    <li class="divider"></li>
                                    <li>
                                        <a href="#">Separated link</a>
                                    </li>
                                </ul>
                            </li>
                        </ul>
                    </div>
                    <!-- /.navbar-collapse -->
                </div>
                <!-- /.container-fluid -->
            </nav>
            
            <!--<div class="jumbotron">
             <p>集散中心第一季度报表</p>
             </div>-->
            <div class="panel panel-default">
                <div class="panel-body">
                    <div class="statistics-title">总收入:</div>
                    <div class="statistics-second">总支出:</div>
                    <div id="myFirstJavaToJs"></div>
                </div>
            </div>
            
            <div id="container" style="height: 80%">
                <script type="text/javascript">
                    
                    function receiveData() {
                        alert("尼玛的，进来没");
                        var chart = new Highcharts.Chart({
                                                         chart: {
                                                         type: 'column',
                                                         renderTo: container,
                                                         spacingTop: 3,
                                                         spacingRight: 0,
                                                         spacingBottom: 3,
                                                         spacingLeft: 0
                                                         },
                                                         yAxis: {
                                                         title: {
                                                         text: ''
                                                         }
                                                         },
                                                         xAxis: {
                                                         categories: [
                                                                      '集散中心',
                                                                      '拉萨公交',
                                                                      '旅游包车',
                                                                      '出租车',
                                                                      '安全'
                                                                      ]
                                                         },
                                                         yAxis: [{
                                                                 min: 0,
                                                                 title: {
                                                                 text: ''
                                                                 }
                                                                 }, {
                                                                 title: {
                                                                 text: ''
                                                                 },
                                                                 opposite: true
                                                                 }],
                                                         legend: {
                                                         shadow: false
                                                         },
                                                         tooltip: {
                                                         shared: true
                                                         },
                                                         plotOptions: {
                                                         column: {
                                                         grouping: false,
                                                         shadow: false,
                                                         borderWidth: 0
                                                         }
                                                         },
                                                         title: {
                                                         text: '集散中心第一季度报表'
                                                         },
                                                         
                                                         credits: {
                                                         enabled: false
                                                         },
                                                         series: [{
                                                                  name: '收入1',
                                                                  color: 'rgba(165,170,217,1)',
                                                                  data: [150, 73, 20,30,40],
                                                                  pointPadding: 0.3,
                                                                  tooltip: {
                                                                  valuePrefix: '￥',
                                                                  valueSuffix: ' 元'
                                                                  },
                                                                  pointPlacement: -0.2
                                                                  }, {
                                                                  name: '收入2',
                                                                  color: 'rgba(126,86,134,.9)',
                                                                  data: [140, 90, 40,90,100],
                                                                  tooltip: {
                                                                  valuePrefix: '￥',
                                                                  valueSuffix: ' 元'
                                                                  },
                                                                  pointPadding: 0.4,
                                                                  pointPlacement: -0.2
                                                                  },{
                                                                  name: '支出1',
                                                                  color: 'rgba(165,170,217,1)',
                                                                  data: [150, 73, 20,30,40],
                                                                  pointPadding: 0.3,
                                                                  tooltip: {
                                                                  valuePrefix: '￥',
                                                                  valueSuffix: ' 元'
                                                                  },
                                                                  pointPlacement: 0.1
                                                                  },{
                                                                  name: '支出2',
                                                                  color: 'rgba(126,86,134,.9)',
                                                                  data: [140, 90, 40,90,100],
                                                                  tooltip: {
                                                                  valuePrefix: '￥',
                                                                  valueSuffix: ' 元'
                                                                  },
                                                                  pointPadding: 0.4,
                                                                  pointPlacement: 0.1
                                                                  },{
                                                                  name: '盈余1',
                                                                  color: 'rgba(165,170,217,1)',
                                                                  data: [150, 73, 20,30,40],
                                                                  pointPadding: 0.3,
                                                                  tooltip: {
                                                                  valuePrefix: '￥',
                                                                  valueSuffix: ' 元'
                                                                  },
                                                                  pointPlacement: 0.4
                                                                  },{
                                                                  name: '盈余2',
                                                                  color: 'rgba(126,86,134,.9)',
                                                                  data: [140, 90, 40,90,100],
                                                                  tooltip: {
                                                                  valuePrefix: '￥',
                                                                  valueSuffix: ' 元'
                                                                  },
                                                                  pointPadding: 0.4,
                                                                  pointPlacement: 0.4
                                                                  }]
                                                         });
                    }
                    </script>
            </div>
            
        </div>
        
    </body>
    
</html>
